<head th:fragment="frontHeader">
    <meta charset="UTF-8">
    <meta http-equiv="Cache-Control" content="no-transform">
    <meta http-equiv="Content-Language" content="zh-CN">
    <meta name="viewport"
          content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0">
    <link rel="icon" href="" type="image/x-icon">
    <link rel="shortcut icon" href="" type="image/x-icon">
    <meta name="keywords" th:content="${title}">
    <meta name="description" th:content="${title} ">
    <title th:text="${title}"></title>
    <link rel="stylesheet" rev="stylesheet" th:href="@{/css/assets/css/bootstrap.min-1.css}" type="text/css"
          media="all">
    <link rel="stylesheet" rev="stylesheet" th:href="@{/css/assets/css/style-1.css}"
          type="text/css" media="all">
    <link rel="stylesheet" th:href="@{/css/assets/css/font-awesome.min-1.css}" media="screen" type="text/css">
    <script th:src="@{/css/assets/js/jquery-2.2.4.min-1.js}" type="text/javascript"></script>
    <script th:src="@{/css/assets/js/bootstrap.min-1.js}" type="text/javascript"></script>
    <script th:src="@{/css/assets/js/jquery.bxslider-1.js}" type="text/javascript"></script>
</head>

<header class="header opaque" th:fragment="header_menu">
    <div id="navBox" class="header-nav menu" data-type="index">
        <div class="container nav-content">
            <div class="logobox">
                <h1 class="logo">
                    <a th:href="@{/front/index}">
                        <img class="logoa" th:src="${company.companyLogo}">
                        <img class="logob" th:src="${company.companyLogo}"></a>
                </h1>
<!--                <h2 class="logo system-name" ><p th:text="${systemName}">云南滇约新能源研究院</p></h2>-->
            </div>
            <div class="lang">
                <a href="javascript:;" class="dropdown-toggle" data-toggle="dropdown" aria-expanded="false">
                    <i class="fa fa-language"></i> 简体中文 <i class="fa fa-angle-down"></i>
                </a>
                <ul class="dropdown-menu" style="width: 90px;min-width: 90px">
                    <li class="active">
                        <a href="">简体中文</a>
                    </li>
                </ul>
            </div>
<!--            <div class="sbtn"><i class="fa fa-search"></i></div>-->

            <ul class="navbar">
                <li th:each="item : ${menus}"
                    th:class="${item.active}==1 ? 'active':''"><a
                        th:href="@{${item.pageUrl}}"
                        th:text="${item.menuName}">首页</a>
                    <ul>
                        <li th:each="child : ${item.childs}"><a th:href="@{${child.pageUrl}}"
                                                                th:text="${child.menuName}">产品系列1</a>
                        </li>
                    </ul>
                </li>
            </ul>
        </div>
    </div>
<!--    <div class="searchBox">-->
<!--        <div class="search-pup">-->
<!--            <form method="get" name="searchform" class="dropdown search-form" action="/">-->
<!--                <input class="search-input" name="search" style="color: #333" placeholder="请输入关键词" type="text">-->
<!--                <button><i class="fa fa-search"></i></button>-->
<!--            </form>-->
<!--        </div>-->
<!--    </div>-->
    <div class="moble">
        <a class="moble-bars" id="btn-bars"><i class="fa fa-bars nav-btn"></i></a>
        <div class="mlang">
            <a href="javascript:;" class="dropdown-toggle" data-toggle="dropdown" aria-expanded="false">
                <i class="fa fa-language"></i>
                <i class="fa fa-angle-down"></i>
            </a>
            <ul class="dropdown-menu" style="width: 90px;min-width: 90px">
                <li class="active">
                    <a th:href="@{/front/index}">简体中文</a>
                </li>
            </ul>
        </div>
    </div>
</header>

<!--
    number 页码。页码从1开始，如：1，2，3，4，5，...
    offset 页码偏移量。如果页码是从0开始，则偏移量为-1；如果页码从1开始，偏移量为0
    totalPages 分页后，页的总数量。
    url URL地址。形如：/c , /c?id=1, /c/b?id=1&limit=10。

    1,会自动向url中添加页码，如：/c?id=1&page=1, /c/b?id=1&limit=10&page=1
    2,当超过totalPages>maxButtons时，会显示...代替多余的按钮
    3,maxButtons>=floatButtons*2
-->
<div class="text-center" th:fragment="pagination" th:with="maxButtons=6,floatButtons=3,offset=0">
    <ul class="pagination">
        <!-- 上一页 -->
        <li th:if="${page.pageNum == 1}"><span>上一页</span></li>
        <li th:if="${page.pageNum > 1}"><a
                th:href="@{${url}(pageNum=${page.pageNum+offset-1},pageSize=${page.pageSize})}">上一页
        </a></li>
        <!-- 首页 -->
        <li th:if="${page.pageNum  == 1}" class="active"><span>1</span></li>
        <li th:if="${page.pageNum  > 1}"><a th:href="@{${url}(pageNum=${1+offset},pageSize=${page.pageSize})}">1</a></li>

        <th:block th:if="${page.totalPages>2 && page.totalPages<=maxButtons}" th:each="i : ${#numbers.sequence(2,page.totalPages-1)}">
            <li th:if="${page.pageNum  == i}" class="active"><span th:text="${i}">页码</span></li>
            <li th:if="${page.pageNum  != i}"><a th:href="@{${url}(pageNum=${i+offset})}" th:text="${i}">页码</a></li>
        </th:block>

        <th:block th:if="${page.totalPages > maxButtons}">
            <th:block th:if="${(page.pageNum-(floatButtons/2)) <= 2}" th:each="i : ${#numbers.sequence(2,2+floatButtons-1)}">
                <li th:if="${page.pageNum == i}" class="active"><span th:text="${i}">页码</span></li>
                <li th:if="${page.pageNum != i}"><a th:href="@{${url}(pageNum=${i+offset})}" th:text="${i}">页码</a></li>
            </th:block>
            <!-- ... -->
            <li th:if="${(page.pageNum-(floatButtons/2))>2}"><span>...</span></li>

            <th:block th:if="${((page.pageNum-(floatButtons/2))>2) && ((page.pageNum+(floatButtons/2)-(floatButtons%2==0?1:0)) < (page.totalPages-1))}"
                      th:each="i : ${#numbers.sequence(page.pageNum-(floatButtons/2),page.pageNum+(floatButtons/2)-(floatButtons%2==0?1:0))}">
                <li th:if="${page.pageNum == i}" class="active"><span th:text="${i}">页码</span></li>
                <li th:if="${page.pageNum != i}"><a th:href="@{${url}(pageNum=${i+offset})}" th:text="${i}">页码</a></li>
            </th:block>
            <!-- ... -->
            <li th:if="${(page.pageNum+(floatButtons/2)-(floatButtons%2==0?1:0)) < (page.totalPages-1)}"><span>...</span></li>
            <th:block th:if="${(page.pageNum+(floatButtons/2)-(floatButtons%2==0?1:0)) >= (page.totalPages-1)}" th:each="i : ${#numbers.sequence(page.totalPages-floatButtons,page.totalPages-1)}">
                <li th:if="${page.pageNum == i}" class="active"><span th:text="${i}">页码</span></li>
                <li th:if="${page.pageNum != i}"><a th:href="@{${url}(pageNum=${i+offset})}" th:text="${i}">页码</a></li>
            </th:block>
        </th:block>
        <!-- 最后一页 -->
        <li th:if="${page.totalPages>1 && page.pageNum == page.totalPages}" class="active"><span th:text="${page.totalPages}">页码</span></li>
        <li th:if="${page.totalPages>1 && page.pageNum != page.totalPages}"><a th:href="@{${url}(pageNum=${page.totalPages+offset})}" th:text="${page.totalPages}">页码</a></li>

        <!-- 下一页 -->
        <li th:if="${page.pageNum >= page.totalPages}"><span>下一页</span></li>
        <li th:if="${page.pageNum < page.totalPages}"><a th:href="@{${url}(pageNum=${page.pageNum+offset+1})}">下一页</a></li>
    </ul>
</div>


<div th:fragment="footer">
    <footer class="footer">
        <div class="sidebar">
            <div class="widget widget-tie social anim fadeInLeft">
                <div class="addBox">
                    <span class="tel"><i class="fa fa-phone-square"></i><a
                            th:href="'tel:'+${company.phoneNumber}" th:text="${company.phoneNumber}">400-000-0000</a></span>
                    <span class="add" th:text="${company.address}">
                        地址：云南省昆明市宝海公园 </span>
                    <span>手机：<a th:href="'tel:'+${company.phoneNumber}" th:text="${company.phoneNumber}">400-000-0000</a></span>
                    <span>邮箱：<a th:href="'tel:'+${company.email}" th:text="${company.email}">123123@163.com</a></span>
                </div>
                <a th:href="'tel:'+${company.qq}"
                   target="_blank" class="socialLink s-qq" rel="nofollow" title=""><i class="fa fa-qq"></i></a>
                <a class="socialLink s-weixin" href="javascript:void(0)" title="扫描二维码"><i class="fa fa-wechat"></i>
                    <div class="weixin">
                        <div class="img"><img th:src="${company.wechatQr}"
                                              alt="扫描二维码"></div>
                        <p>手机扫一扫添加微信</p>
                    </div>
                </a>
                <a th:href="'tel:'+${company.email}" target="_blank" class="socialLink s-email" rel="nofollow" title="邮箱"><i
                        class="fa fa-envelope"></i></a>
                <a target="_blank" href="#" class="socialLink s-qun" rel="nofollow" title="RSS"><i
                        class="fa fa-rss"></i></a>
            </div>
            <div class="link">
                <span>友情链接</span>
                <ul>
                    <li><a href="http://www.heixie.com" target="_blank">黑蝎策划机构官网</a></li>
                </ul>
            </div>
            <div class="fweixin"><img th:src="${company.wechatQr}"></div>
        </div>
        <div class="footer-text anim fadeInRight beian" data-wow-offset="0">
            <div class="beian-item">版权所有： 云南滇约新能源研究院</div>
            <div class="beian-item">滇ICP备号： 滇ICP备2022000387号-3</div>
            <div class="beian-item">业务主管单位： 云南黑蝎营销策划有限公司</div>
            <div class="beian-item">公安部查询网站： www.beian.miit.gov.cn</div>
            <div class="beian-item">电话： 18088488800</div>
            <div class="beian-item">邮箱： 1841311481@qq.com</div>

<!--            <p>Copyright © 2024 <a href="index.html">苏州xx教育公司</a>&nbsp;-->
<!--                <a href="sitemap.xml">网站Sitemap</a>-->
<!--                <a href="https://beian.miit.gov.cn" target="_blank" rel="nofollow">备案号:苏ICP备88888888号</a>-->
<!--            </p>-->
        </div>
    </footer>
    <div class="page-bg"></div>
    <div id="backTop">
        <span class="ft-tel"><i class="fa fa-phone"></i><small class="telTop" th:text="${company.phoneNumber}">13108661155</small></span>
        <span class="ft-wx"><i class="fa fa-wechat"></i><small class="weixin"><b class="fa fa-caret-right"></b><img
                th:src="${company.wechatQr}" alt="扫描微信"></small></span>
        <span class="ft-qq"><a
                th:href="${company.qq}"
                target="_blank" class="socialLink s-qq" rel="nofollow"><i class="fa fa-qq"></i></a></span>
        <span id="gttop" onclick="return false;" title="返回顶部"> <i class="fa fa-arrow-up"></i> </span>
    </div>
    <script th:src="@{/css/assets/js/lib-1.js?v=1.0.3}"></script>
    <script th:src="@{/css/assets/js/function-1.js?v=1.0.3}"></script>
    <script type="text/javascript">
        (function () {
            var bLazy = new Blazy({
                breakpoints: [{}]
                , success: function (element) {
                    setTimeout(function () {
                        var parent = element.parentNode;
                        parent.className = parent.className.replace(/bloadingb/, '');
                    }, 200);
                }
            });
            var wow = new WOW({boxClass: 'anim', offset: 100, mobile: true, live: true});
            wow.init();
        })();
    </script>
</div>